<?php

function display_title($title) {
    echo '<h3 style="margin-top:0px; padding-top:0px; margin-bottom:0; padding-bottom:15px; font-size:1.6em;">'.$title.'</h3>';
}

/**
 * 头
 */
function display_header() {
	?>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>AdminLTE 2 | General Form Elements</title>
	<!-- Tell the browser to be responsive to screen width -->
	<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
	<!-- Bootstrap 3.3.7 -->
	<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
	<!-- Font Awesome -->
	<link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
	<!-- Ionicons -->
	<link rel="stylesheet" href="bower_components/Ionicons/css/ionicons.min.css">
	<!-- daterange picker -->
	<link rel="stylesheet" href="bower_components/bootstrap-daterangepicker/daterangepicker.css">
	<!-- Theme style -->
	<link rel="stylesheet" href="dist/css/AdminLTE.min.css">
	<!-- AdminLTE Skins. Choose a skin from the css/skins
		 folder instead of downloading all of them to reduce the load. -->
	<link rel="stylesheet" href="dist/css/skins/_all-skins.min.css">
    <link rel="stylesheet" href="css/pace.css">

	<link rel="stylesheet" href="plugins/iCheck/all.css">
	<style>
		.small-box-footer {height:40px; line-height:35px;}
		.data_table th {font-size:14px; color:#666; font-weight:normal; width:180px;}
		.data_table td {font-size:18px; font-weight:normal;text-align:right;}
		.data_table td small {font-size:12px; color:#888;margin-left:3px;}
		.data_table td div {padding:0;}
		td,th {vertical-align:middle !important;}
		.filter_box {font-size:12px;}
		.filter_box div {border:1px solid #4b97c4; border-radius:5px; padding:4px 7px; margin-right:5px; margin-left:10px; display:inline-block; padding-right:0 !important;}
		.filter_box div strong {color:#155;}
		.filter_box div span.badge {position:relative; left:11px; top:-15px; cursor:pointer;}
		.filter_box div span.badge:hover {background:#f70 !important; color:#ff0 !important;}
		optgroup {font-size:15px; font-weight:bold; color:#555599;}
		option {font-size:14px; font-weight:normal; color:#666;}

        .mail_form_box {margin-bottom:20px;}
        .mail_form_box div {margin-bottom:5px;}
        .attach_box {border:1px solid #eee;border-radius:5px;padding:5px;margin-top:5px;}
        .attach_box button {margin-right:20px;}
        .attach_box select {width:300px;display:inline-block;}
        .attach_box span {padding-left:20px;}
        .attach_box span input {display:inline-block;width:150px;}

        .red {color:#ff0055;}
        .strong {font-weight:bold;}
        .font12 { font-size:12px;}
        .left {text-align:left;}
        .center {text-align:center;}
        .hide {display:none;}
	</style>
</head>

<body class="hold-transition skin-blue sidebar-mini" style="background:#ecf0f5;">
	<?php
}

/**
 * 底部js加载
 */
function footer_load_js() {
	?>
	<script src="js/jquery.min.js"></script>
	<script src="js/jquery.cookie.js"></script>
	<script src="js/jquery.pjax.js"></script>
	<!-- Bootstrap 3.3.7 -->
	<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
	<!-- Select2 -->
	<script src="bower_components/select2/dist/js/select2.full.min.js"></script>
	<!-- InputMask -->
	<script src="plugins/input-mask/jquery.inputmask.js"></script>
	<script src="plugins/input-mask/jquery.inputmask.date.extensions.js"></script>
	<script src="plugins/input-mask/jquery.inputmask.extensions.js"></script>
	<!-- date-range-picker -->
	<script src="bower_components/moment/min/moment.min.js"></script>
	<script src="bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>
	<!-- bootstrap datepicker -->
	<script src="bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
	<!-- bootstrap time picker -->
	<script src="plugins/timepicker/bootstrap-timepicker.min.js"></script>
	<!-- SlimScroll -->
	<script src="bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script>
	<!-- iCheck 1.0.1 -->
	<script src="plugins/iCheck/icheck.min.js"></script>
	<!-- FastClick -->
	<script src="bower_components/fastclick/lib/fastclick.js"></script>
	<!-- AdminLTE App -->
	<script src="dist/js/adminlte.min.js"></script>
	<?php
}

/**
 * 控件js
 */
function load_funtion_js($start_day, $end_day) {
	?>
	var locale = {
	"format": 'YYYY-MM-DD',
	"separator": " -222 ",
	"applyLabel": "确定",
	"cancelLabel": "取消",
	"fromLabel": "起始时间",
	"toLabel": "结束时间'",
	"customRangeLabel": "自定义",
	"weekLabel": "W",
	"daysOfWeek": ["日", "一", "二", "三", "四", "五", "六"],
	"monthNames": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
	"firstDay": 1
	};

	$('#daterange-btn').daterangepicker(
	{
	locale   : locale,
	ranges   : {
	'今日'       : [moment(), moment()],
	'昨日'   : [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
	'最近7日' : [moment().subtract(6, 'days'), moment()],
	'本月'  : [moment().startOf('month'), moment().endOf('month')],
	'上月'  : [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')],
	'近3个月'  : [moment().subtract(2, 'month').startOf('month'), moment().endOf('month')],
	'今年'  : [moment().startOf('year'), moment().endOf('year')]
	},
	startDate: '<?php echo $start_day; ?>',
	endDate  : '<?php echo $end_day; ?>'
	},
	function (start, end) {
	$('#search_start_date').val(start.format('YYYY-MM-DD'));
	$('#search_end_date').val(end.format('YYYY-MM-DD'));
	}
	);

	$('input[name="start"]').daterangepicker({
	locale: locale,
	singleDatePicker: true,
	showDropdowns: true,
	minYear: 1901,
	maxYear: parseInt(moment().format('YYYY'),10)
	}, function(start) {
	//$('#search_start_date').val(start.format('YYYY-MM-DD'));
	});

	$('input[name="end"]').daterangepicker({
	locale: locale,
	singleDatePicker: true,
	showDropdowns: true,
	minYear: 1901,
	maxYear: parseInt(moment().format('YYYY'),10)
	}, function(end) {
	//$('#search_end_date').val(end.format('YYYY-MM-DD'));
	});

	setTimeout(function() {
	$('.alert-success').fadeOut();
	if($('.alert-warning').find('span').html() && $('.alert-warning').find('span').html().length < 60) {
	$('.alert-warning').fadeOut();
	}
	}, 2000);
	<?php
}